<!-- src/views/post/PostEdit.vue -->
<template>
  <a-card class="post-edit-container">
    <a-form :model="form" layout="vertical">
      <a-form-item label="标题" field="title" required>
        <a-input v-model="form.title" placeholder="请输入标题" />
      </a-form-item>

      <a-form-item label="内容" field="content" required>
        <a-textarea
          v-model="form.content"
          placeholder="请输入内容"
          :auto-size="{ minRows: 10 }"
        />
      </a-form-item>

      <a-form-item label="标签" field="tags">
        <a-select
          v-model="form.tags"
          multiple
          placeholder="请选择标签"
          allow-create
        >
          <a-option v-for="tag in tagOptions" :key="tag" :value="tag"
            >{{ tag }}
          </a-option>
        </a-select>
      </a-form-item>

      <a-form-item>
        <a-space>
          <a-button type="primary" @click="handleSubmit">提交</a-button>
          <a-button @click="handleCancel">取消</a-button>
        </a-space>
      </a-form-item>
    </a-form>
  </a-card>
</template>

<script setup>
import { ref, onMounted } from "vue";
import { useRoute, useRouter } from "vue-router";
import { Message } from "@arco-design/web-vue";
import { PostControllerService } from "../../../generated";

const route = useRoute();
const router = useRouter();

const isEdit = ref(false);
const postId = ref(null);

// 表单数据
const form = ref({
  title: "",
  content: "",
  tags: [],
});

// 标签选项
const tagOptions = ref(["技术", "生活", "学习", "分享", "问答"]);

// 加载帖子数据（编辑时）
const loadPostData = async () => {
  if (!isEdit.value) return;

  try {
    const res = await PostControllerService.getPostVoByIdUsingGet(postId.value);
    if (res.code === 0) {
      form.value = {
        title: res.data.title,
        content: res.data.content,
        tags: res.data.tagList || [], // 使用 tagList 而非解析 tags
      };
    }
  } catch (e) {
    Message.error("加载帖子失败");
    router.back();
  }
};

// 提交表单
const handleSubmit = async () => {
  if (!form.value.title || !form.value.content) {
    Message.error("请填写标题和内容");
    return;
  }

  try {
    const params = {
      ...form.value,
      tags: form.value.tags, // 直接传递数组，不要JSON.stringify
      id: isEdit.value ? postId.value : undefined,
    };

    if (isEdit.value) {
      params.id = postId.value;
      const res = await PostControllerService.editPostUsingPost(params);
      if (res.code === 0) {
        Message.success("更新成功");
        router.push(`/post/detail/${postId.value}`);
      }
    } else {
      const res = await PostControllerService.addPostUsingPost(params);
      if (res.code === 0) {
        Message.success("创建成功");
        router.push(`/post/detail/${res.data}`);
      }
    }
  } catch (e) {
    Message.error(isEdit.value ? "更新失败" : "创建失败");
  }
};

// 取消
const handleCancel = () => {
  router.back();
};

onMounted(() => {
  if (route.params.id) {
    isEdit.value = true;
    postId.value = route.params.id; // 直接使用字符串，不转换为 Number
    loadPostData();
  }
});
</script>

<style scoped>
.post-edit-container {
  margin: 20px;
  max-width: 800px;
}
</style>
